<template>
	<view
		v-if="show"
		:style="{
			paddingTop: marginTop + 'rpx',
			height: height
		}"
		class="flex align-center justify-center flex-column"
	>
		<image
			:style="{
				width: iconW + 'rpx',
				height: iconH + 'rpx'
			}"
			:src="src ? src : handleIcon"
			:mode="mode"
		></image>
		<view
			:style="{
				color: color,
				fontSize: fontSize + 'rpx',
				marginTop: fontMt + 'rpx'
			}"
		>
			{{ text }}
		</view>
		<view
			v-if="isButton"
			class="u-m-t-50 u-font-28 rounded-circle u-p-t-18 u-p-b-18 u-p-l-64 u-p-r-64 goOpen"
			:style="{
				color: btnTextColor,
			}"
			@click="goPage"
		>
			{{ btnText }}
		</view>
	</view>
</template>

<script>
export default {
	props: {
		// 按钮跳转
		pageUrl: {
			type: Object,
			default (){
				return {}
			}
		},
		// 按钮文字
		btnText: {
			type: String,
			default: '去逛逛'
		},
		// 按钮文字颜色
		btnTextColor: {
			type: String,
			default: '#727B7F'
		},
		// 是否显示按钮
		isButton: {
			type: Boolean,
			default: false
		},
		// 空状态盒子高度
		height: {
			type: String,
			default: 'auto'
		},
		// 提示文字margin-top
		fontMt: {
			type: [String, Number],
			default: 40
		},
		// 提示文字大小
		fontSize: {
			type: [String, Number],
			default: 36
		},
		// 提示文字颜色
		color: {
			type: String,
			default: '#333333'
		},
		// 空状态盒子的padding-top
		marginTop: {
			type: [String, Number],
			default: 240
		},
		// 是否显示空状态
		show: {
			type: Boolean,
			default: true
		},
		// 提示文字内容
		text: {
			type: String,
			default: '暂无数据'
		},
		// 图片宽度
		iconW: {
			type: [String, Number],
			default: 520
		},
		// 图片高度
		iconH: {
			type: [String, Number],
			default: 336
		},
		// 图片路径
		src: {
			type: String,
			default: ''
		},
		//图片展示模式
		mode:{
			type: String,
			default: 'scaleToFill'
		},
		// 图片列表模式
		icon:{
			type: String,
			default: 'details'
		},
	},
	data() {
		return {
			imgList: [
				{
					//明细
					mode: 'details',
					url: require('../../static/empty/qsy2@2x.png')
				},
				{
					//记录
					mode: 'record',
					url:  require('../../static/empty/qsy1@2x.png')
				}, 
				{
					//审核
					mode: 'Audit',
					url:  require('../../static/empty/queshengye@2x.png')
				}
			]
		};
	},
	computed: {
		handleIcon() {
			let obj = this.imgList.find(e => e.mode == this.icon);
			if (obj) return obj.url;
			else return require('../../static/empty/qsy2@2x.png');
		}
	},
	methods: {
		goPage() {
			if (Object.keys(this.pageUrl).length) {
				this.openPage(this.pageUrl.isToken, this.pageUrl.t, this.pageUrl.u, this.pageUrl.d );
			}
		}
	}
};
</script>

<style scoped lang="scss">
.goOpen {
	border: 2rpx solid #236EFD;
}
/deep/.u-load-more-wrap[data-v-874545c0] {
    z-index: 0;
}
</style>